﻿@namespace SageKing.Studio.Pages.SysMenuPage.component

@implements IAddEdit<SysMenu,long>

@inject AntDesignIconListService _iconListService
@inject SysMenuService _dataService
@inject SysDictTypeService selectService

<Form @ref="form"
      Model="@model" ValidateMode="FormValidateMode.Complex"
      ValidateOnChange="true"
      LabelColSpan="8" WrapperColSpan="16">

    <Row Gutter="24">
        <Col Span="8">
        <FormItem Label="父Id">
            <Input @bind-Value="@context.Pid" Disabled />
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="类型">
            <EnumSelect @bind-Value="@context.Type"
                        TEnum="MenuTypeEnum"
                        Style="width: 100%;"
                        Placeholder="请选菜单类型"
                        DefaultActiveFirstOption="true"
                        EnableSearch>
            </EnumSelect>
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="路由名称">
            <Input ShowCount MaxLength="64" @bind-Value="@context.Name" />
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="8">
        <FormItem Label="菜单名称">
            <Input ShowCount MaxLength="128" @bind-Value="@context.Title" />
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="图标">
            <Select Context="cicon"
                    Style="width: 100%;" EnableSearch @bind-Value="@context.Icon"
                    ItemValue="c=>c" OnSearch="OnSearchIcon" AllowClear="true" OnClearSelected="()=>IconClearSelected()"
                    DataSource="_currentNames"
                    DropdownMatchSelectWidth="false"
                    ListboxStyle="display:flex;height: 200px;flex-flow: wrap; max-width: 500px;margin:5px; align-content: baseline;">
                <ItemTemplate>
                    <Tooltip ArrowPointAtCenter="true">
                        <TitleTemplate>
                            <Icon Type="@cicon" /> @cicon
                        </TitleTemplate>
                        <ChildContent>
                            <Icon Type="@cicon" />
                        </ChildContent>
                    </Tooltip>
                </ItemTemplate>
                <LabelTemplate>
                    <p style="line-height: 30px;"><Icon Type="@cicon" /> @cicon</p>
                </LabelTemplate>
                <DropdownRender>
                    <Card Class="noborder" Style="margin:0px;padding:0px;" BodyStyle="padding:0px;margin-bottom:10px;">    
                            <Tabs @bind-ActiveKey="@TabIconactiveKey" OnChange="OnChange" OnTabClick="OnChange">
                                @foreach (var item in _lstIcons)
                                {
                                    <TabPane Key="@item.Key">
                                         <TabTemplate>@item.Key</TabTemplate>
                                    </TabPane>
                                }
                            </Tabs>  
                    </Card>
                    @cicon
                </DropdownRender>
            </Select>
        </FormItem>
        </Col>

        <Col Span="8">
        <FormItem Label="权限标识">
            <Input ShowCount MaxLength="128" @bind-Value="@context.Permission" />
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="8">
        <FormItem Label="是否内嵌">
            <Switch @bind-Value="@context.IsIframe" CheckedChildren="是" UnCheckedChildren="否"></Switch>
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="是否启用">
            <Switch @bind-Value="@context.Status" CheckedChildren="开" UnCheckedChildren="关"></Switch>
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="是否固定">
            <Switch @bind-Value="@context.IsAffix" CheckedChildren="是" UnCheckedChildren="否"></Switch>
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="8">
        <FormItem Label="是否隐藏">
            <Switch @bind-Value="@context.IsHide" CheckedChildren="是" UnCheckedChildren="否"></Switch>
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="是否缓存">
            <Switch @bind-Value="@context.IsKeepAlive" CheckedChildren="是" UnCheckedChildren="否"></Switch>
        </FormItem>
        </Col>
        <Col Span="8">
        <FormItem Label="排序">
            <AntDesign.InputNumber @bind-Value="@context.OrderNo" Min="1" Max="9999" DefaultValue="100" Width="100%" PlaceHolder="排序"></AntDesign.InputNumber>
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="12">
        <FormItem Label="路由地址" LabelColSpan="5" WrapperColSpan="19">
            <Input ShowCount MaxLength="128" @bind-Value="@context.Path" />
        </FormItem>
        </Col>
        <Col Span="12">
        <FormItem Label="组件路径" LabelColSpan="5" WrapperColSpan="19">
            <Input ShowCount MaxLength="128" @bind-Value="@context.Component" />
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="12">
        <FormItem Label="重定向" LabelColSpan="5" WrapperColSpan="19">
            <Input ShowCount MaxLength="128" @bind-Value="@context.Redirect" />
        </FormItem>
        </Col>
        <Col Span="12">
        <FormItem Label="外链链接" LabelColSpan="5" WrapperColSpan="19">
            <Input ShowCount MaxLength="256" @bind-Value="@context.OutLink" />
        </FormItem>
        </Col>
    </Row>
    <Row Gutter="24">
        <Col Span="24">
        <FormItem Label="备注" LabelColSpan="2" WrapperColSpan="22" Style="margin-left:15px;">
            <TextArea ShowCount MaxLength="256" Width="100%" Placeholder="备注" @bind-Value="@context.Remark"></TextArea>
        </FormItem>
        </Col>
    </Row>
</Form> 

<style>
   .noborder .ant-card-head{
        border:0;
    }
</style>

@code {

    #region IAddEdit
    public IAddEdit<SysMenu, long> Me { get { return this; } }

    public bool IsVersionValidation { get; set; } = false;

    [Parameter]
    public string Title { get; set; }

    [Parameter]
    public SysMenu model { get; set; }

    public IBaseService<SysMenu, long> DataService
    { get { return _dataService; } }

    public AntDesign.Form<SysMenu> form { get; set; }
    #endregion

    bool loading;

    //select data
    SysDictType SelectType;

    private string TabIconactiveKey { get; set; }
    private Dictionary<string, List<string>> _lstIcons;

    private List<string> _currentNames;

    protected override async Task OnInitializedAsync()
    {
        _lstIcons = _iconListService.GetIcons().ToDictionary(x => x.Category, x => x.IconNames);
        IconClearSelected();

        await Task.CompletedTask;
    }

    private void OnChange(string tab)
    {
        _currentNames = _lstIcons[tab].ToList();
    }

    private void IconClearSelected()
    {
        TabIconactiveKey = _lstIcons.Keys.First();
        _currentNames = _lstIcons[TabIconactiveKey].ToList();
    }

    public Action<SysMenu,ChangedEnum> OnModelChanged{ get; set; }

    public void OnSearchIcon(string value)
    {
        if (value.IsNullOrEmpty())
        {
            _currentNames.Clear();
            return;
        }
        var find = _lstIcons.Where(a => a.Value.Contains(value)).FirstOrDefault();
        if (find.Key.IsNotNullOrWhiteSpace())
        {
            TabIconactiveKey = find.Key;
            var currList = find.Value.Where(a => a.Contains(value)).ToList();
            _currentNames = currList;//.Concat(find.Value).Distinct().ToList();
            StateHasChanged();
        }

    }
}